<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Luckin coffee</title>
    <link rel="shortcut icon" href="./image/icon-page1/icon_ruixingkafei1.png">
    <link rel="stylesheet" href="./css/ALL.css">
    <link rel="stylesheet" href="./css/Products.css">
</head>

<body>
    <!-- 头部开始 -->
    <header class="head">
        <!-- logo部分 -->
        <div class="header-logo">
            <a href="Home.html">
                <span class="header-logo-img"></span>
                <strong class="header-logo-font">luckin coffee</strong>
            </a>
        </div>
        <!-- 右侧导航 -->
        <ul>
            <li class="active">
                <a href="Home.html">Home
                    <hr id="line1" class="underline">
                </a>

            </li>
            <li class="active">
                <a href="Get the APP.html">Get the APP
                    <hr id="line2" class="underline">
                </a>
            </li>
            <li class="active">
                <a href="Products.html">Products
                    <hr id="line3" class="underline">
                </a>
            </li>
            <li class="active">
                <a href="About Us.html">About Us
                    <hr id="line4" class="underline">
                </a>
            </li>
            <li class="active">
                <a href="Investor-Relations/Investor Relations.html" target="_blank">Investor Relations
                    <hr id="line5" class="underline">
                </a>
            </li>
        </ul>
    </header>

    <!-- js -->
    <script>
        var head = document.querySelector('.head');
        function scroll() {
            let top = head.offsetTop;
            console.log(top);
            let scrollTop = document.documentElement.scrollTop;
            console.log(scrollTop);
            if (scrollTop <= top) {
                head.style.backgroundColor = 'transparent';
            }
            else {
                head.style.backgroundColor = '#0A2DB8';
            }
        }
        // 每次屏幕滑动时都会检测到，调用scroll方法时刻更新导航栏背景色
        window.addEventListener('scroll', function () {
            scroll();
        })
        scroll();
    </script>

    <!-- 头部结束 -->



    <!-- banner开始 -->
    <div class="banner">
        <div>
            <p class="title">High Quality Arabica Beans</p>
            <p class="text">Our coffee beans are strictly selected from top coffee producing regions around the world,
                such as Ethiopia, Brazil, Colombia and Guatemala. Besides, we make sure each and every bean is Arabica.
            </p>
        </div>
    </div>
    <!-- banner结束 -->



    <!-- best-sellers开始 -->
    <div class="best-sellers">

        <div class="best-sellers-content">
            <p class="title">luckin coffee’s Best Sellers</p>
            <p class="line"></p>
            <p class="text">
                The coffee bean's formula is carefully blended by our team of WBC
                <br>
                champions, hailing from Poland, Italy, Japan, Australia and China.
            </p>
        </div>


        <div class="best-sellers-coffee">
            <div class="coffee-hot">
                <p class="coffee-hot-img img1">
                    <img src="./image/page3/best-sellers1.jpg">
                </p>
                <p class="text">Coconut Latte</p>
            </div>
            <div class="coffee-hot">
                <p class="coffee-hot-img img2">
                    <img src="./image/page3/best-sellers2.jpg">
                </p>
                <p class="text">Velvet Latte</p>
            </div>
            <div class="coffee-hot">
                <p class="coffee-hot-img img3">
                    <img src="./image/page3/best-sellers3.jpg">
                </p>
                <p class="text">Creamy Dreamy Latte</p>
            </div>
            <div class="coffee-hot">
                <p class="coffee-hot-img">
                    <img src="./image/page3/best-sellers4.jpg">
                </p>
                <p class="text">Brown Sugar Velvet Latte</p>
            </div>
        </div>

        <div class="best-sellers-coffee">
            <div class="coffee-hot">
                <p class="coffee-hot-img">
                    <img src="./image/page3/best-sellers5.jpg">
                </p>
                <p class="text">Americano</p>
            </div>
            <div class="coffee-hot">
                <p class="coffee-hot-img">
                    <img src="./image/page3/best-sellers6.jpg">
                </p>
                <p class="text">Latte</p>
            </div>
            <div class="coffee-hot">
                <p class="coffee-hot-img">
                    <img src="./image/page3/best-sellers7.jpg">
                </p>
                <p class="text">Caramel Macchiato</p>
            </div>
            <div class="coffee-hot">
                <p class="coffee-hot-img">
                    <img src="./image/page3/best-sellers8.jpg">
                </p>
                <p class="text">Cappuccino</p>
            </div>
        </div>
    </div>

    <!-- best-sellers结束 -->



    <!-- series开始 -->
    <div class="series">
        <img src="./image/page3/series1.jpg">
        <div class="series-content">
            <div>
                <p class="title">Classic Coffee Series</p>
                <p class="line"></p>
                <p class="text">Our Classic Coffee Series features a unique and mellow taste, created by our champion
                    baristas who selected only the finest 100% Arabica coffee beans from top regions like Ethiopia,
                    Brazil, Colombia, and Guatemala.
                </p>
            </div>
        </div>
    </div>



    <div class="series">
        <div class="series-content">
            <div>
                <p class="title">SOE Specialty Series</p>
                <p class="line"></p>
                <p class="text">Our Single Origin Espresso (SOE) beans, which come from the Yirgacheffe and Hambella
                    region of Ethiopia, are sustainably and meticulously sourced and picked, ensuring a fresh and
                    flavourful experience.
                </p>
            </div>
        </div>
        <img src="./image/page3/series2.jpg">
    </div>


    <div class="series">
        <img src="./image/page3/series3.jpg">
        <div class="series-content">
            <div>
                <p class="title">Exfreezo™ & Fruit Drinks</p>
                <p class="line"></p>
                <p class="text">Looking for a refreshing and indulgent treat? Try our luckin Exfreezo™! Our fruit-based
                    coffee combines the bold taste of coffee with the sweet and juicy taste of fruit for a delightful
                    and refreshing beverage.
                </p>
            </div>
        </div>
    </div>



    <div class="series">
        <div class="series-content">
            <div>
                <p class="title">Bakery & Snacks</p>
                <p class="line"></p>
                <p class="text">Satisfy your cravings with our delicious freshly baked snacks and treats. Prefect
                    pairing to our premium coffee blends.
                </p>
            </div>
        </div>
        <img src="./image/page3/series4.jpg">
    </div>








    <!-- 尾部开始 -->
    <footer>
        <div class="content">
            <!-- logo部分 -->
            <div class="content-logo">
                <span class="content-logo-img"></span>
                <strong class="content-logo-font">luckin coffee</strong>
            </div>
            <!-- 中间部分 -->
            <div class="content-info">

                <!-- 左边 -->
                <div class="content-info-left">
                    <div class="info">
                        <p class="title">Company</p>
                        <p>
                            <a href="About Us.html">OUR BRAND</a>
                        </p>
                        <p>
                            <a href="Products.html">OUR COFFEE</a>
                        </p>
                        <p>
                            <a href="https://investor.lkcoffee.com/">INVESTOR RELATIONS</a>
                        </p>
                    </div>
                    <div class="info">
                        <P class="title">More</P>
                        <p class="text">
                            CONTACT US
                        </p>
                    </div>
                </div>

                <!-- 右边 -->
                <div class="content-info-right">
                    <a href="https://space.bilibili.com/515053624?spm_id_from=333.337.0.0" target="_blank">
                        <p class="bilibili"></p>
                    </a>
                    <a href="https://weibo.com/u/6349791448?nick=luckincoffee%E7%91%9E%E5%B9%B8%E5%92%96%E5%95%A1&noscript=1"
                        target="_blank">
                        <p class="weibo"></p>
                    </a>
                    <a href="#" target="_blank">
                        <p class="wechat"></p>
                    </a>
                </div>
            </div>
            <!-- 最后部分 -->
            <div class="termOfUse">
                <a href="https://luckincoffee.com/privacy-policy">PRIVACY POLICY</a>
                <span style="margin: 0 10px;">|</span>
                <a href="https://luckincoffee.com/terms-of-use">TERMS OF USE</a>
                <span style="margin: 0 10px;">|</span>
                <a href="https://luckincoffee.com/cookie-policy">COOKIESPOLICY</a>
            </div>
        </div>
    </footer>
    <!-- 尾部结束 -->
</body>

</html>